<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/default.css" />
		<link rel="stylesheet" type="text/css" href="css/iconfont.css"/>
		<link rel="stylesheet" type="text/css" href="css/style1.css" />

		<style type="text/css">
			.touxiang:before {
				width: 24px;
				height: 40px;
				position: absolute;
				bottom: 0;
				left: 27%;
				background: url('images/titleimg.png') no-repeat bottom right /13px 43px;
				content: '';
				-webkit-transform: scaleY(.5);
				transform: scaleY(.5);
			}
			
			.riskinfor {
				padding: 20px 10px;
				color: #C8C8C8;
			}
			
			.mui-table-view:after {
				height: 0;
			}
			
			.mui-table-view:before {
				height: 0;
			}
			
			.mui-table-view-cell:not(:nth-child(6)):after {
				height: 0;
			}
			.hps-col-sy{
				 color:#9B9EA3;
				 font-size: 14px;
				 margin-bottom: 20px;
			}
			.hps-icon-follow{
				background: url(images/icon/nav_icon_like_default.png) no-repeat;
				width: 25px;
				height: 25px;
				display: inline-block;
				background-position: -15px -8px;
				transform: scale(0.9);
				margin-top: 8px;
				margin-right: 18px;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav" id='header'>
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left white-big"></a>
			<h1 class="mui-title white-big">黑皮书</h1>
			
			<a href="javascript:;" class="iconfont icon-fenxiang mui-pull-right white-big"></a>
			<a class="mui-pull-right hps-icon-follow" onclick="addCol(this)"></a>
		</header>
		<div class="mui-content">
			<div class="coinnm tc">
				<h3 class="blackest tl" id="title"></h3>
				<!-- <span class='white-small focuson' onclick="addCol(this)">关注</span> -->
			</div>
			<div class="infodetails">
				<p class="grey-lighter mui-ellipsis-2 hps-bg-gary" id="intro">区块链行业的风险投资格式家专注于区块链行业的风险投资格式区块链行业的风险投资格式家专注于区块链行业的风险投资格式,是全球最早布局区块链生态的专业投资机构之一
				</p>
			</div>

			<!--榜主信息-->
			<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media">
					<a href="javascript:;" class="mui-navigate-right flexbox">
						<img class="mui-media-object mui-pull-left imgmid-peopl" src="http://placehold.it/40x30">
						<div class="mui-media-body">
							<p class="col-222" id="nickname">金木研</p>
							<p class="mui-ellipsis"><span class="grey-smaller" id="pubDate">发布于6月2日</span></p>
						</div>
						<p><span class="grey-smaller" id='publistnum'>已发布榜单：3</span></p>
					</a>
				</li>
				<li class="mui-table-view-cell">
					<section class='title2'>
						<dl class="fl">
							<dd>
								<span class="blacker-small">总数：3</span>
								<span class="blacker-small">上涨：2</span>
								<span class="blacker-small">下跌：1</span>
							</dd>
							<dd class="blacker-small">总市值：￥1210.1亿</dd>
							<dd class="blacker-small">全球交易量(24h)：13.965亿</dd>
						</dl>
						<dl class='fr'>
							<dd class="tr hps-col-sy">平均涨跌</dd>
							<dd class="tr green-biger">+1.29%</dd>
						</dl>
					</section>
				</li>
			</ul>
			<!--以币种币值/现价/涨跌排名，暂时不做-->
			<ul class="mui-table-view" id='listpaiming'>
				<!--<li class="mui-table-view-cell mui-media">
					<a href="coindetail3.html">
						<img class="mui-media-object mui-pull-left imgsma-coin" src="http://placehold.it/40x30">
						<div class="mui-media-body">
							<dl class="flexbox">
								<dd>
									<span class="black-small">EOS/柚子</span>
									<span class="grey-light">￥804.1亿</span>
								</dd>
								<dd>
									<span class="black-small">￥89.47</span>
									<span class="grey-light">$16.34</span>
								</dd>
								<dd class="green-big">+2.49%</dd>
							</dl>
						</div>
					</a>
					<p class="mui-ellipsis personsay">“榜主说：不需要解释，柚子就是叼。”</p>
				</li>-->
			</ul>
			<p class="grey-lighter tc riskinfor">本榜单信息仅作参考，不构成投资意见，投资者据此操作，后果自担</p>
			<input type="hidden" id="hid" />
		</div>
		<script src="js/mui.min.js"></script>
		<script src="js/jquery-2.1.3.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="js/config.js" charset="utf-8"></script>
		<script src="js/setfontsize.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init();
			//			mui('.mui-scroll-wrapper').scroll({
			//				deceleration: 0.0005 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
			//			});
			mui.plusReady(function() {
				var self = plus.webview.currentWebview();
				var hid = self.hid;
				$("#hid").val(hid);
				init(hid);
			});
			var uid = localStorage.getItem("uid");
			
			function init(hid) {
				mui.ajax(mkurl + '/api/market/hlistd', {
					data: {
						hid: hid
					},
					dataType: 'json',
					type: 'post',
					success: function(data) {
						var cData = data;
						var intro, title, hostinfor;
						//				$('#intro').html('');					
						//				$('#title').html('');
						//				$('#hostinfor').html('');
						//				$('#listpaiming').html('');
						if(cData.status == 1) {
							var result = cData.result;
							title = '<h3 class="blackest tl" style="text-align: center;" id="title">' + result.title + '</h3>';
							intro = '<p class="grey-lighter mui-ellipsis-2" id="intro">' + result.intro + '</p>';
							//头部信息
							$('#intro').html(intro);
							$('#title').html(title);
							console.log(result.follow)
							if(result.follow == 1) {
								$(".focuson").html("已关注");
							}
							//用户信息
							$('#nickname').html(result.nickname);
							var pubDate = formatDate(new Date(result.createTime), "yyyy-MM-dd");
							$("#pubDate").html(pubDate);
							$("#publistnum").html("已发布榜单：" + result.hcount);
							//中部信息
							hostinfor = '<dl class="fl"><dd><span class="blacker-small">总数：' + result.hListItem.totalCount + '</span>&nbsp;' +
								'<span class="blacker-small">上涨：' + result.hListItem.rCount + '</span>&nbsp;' +
								'<span class="blacker-small">下跌：' + result.hListItem.fCount + '</span></dd>' +
								'<dd class="blacker-small">总市值：￥' + result.hListItem.mkvTotal + '</dd>' +
								'<dd class="blacker-small">全球交易量(24h)：' + result.hListItem.mkv24Total + '</dd>' +
								'</dl><dl class="fr"><dd class="tr blacker-small">平均涨跌</dd>' +
								'<dd class="tr green-biger">' + result.hListItem.averageRF + '%</dd></dl>';
							for(i = 0; i < result.hListItem.list.length; i++) {
								var item = result.hListItem.list[i];
								var mkvalstr = (item.marketValue.toFixed(2) / 100000000).toFixed(2);
								var cls = "green-big";
								var valStr = item.percent24h;
								if(valStr < 0) {
									cls = "red-big";
								} else {
									valStr = "+" + valStr;
								}
								var commStr = '';
								if(item.comment != null && item.comment != "") {
									commStr = '<p class="mui-ellipsis personsay">"' + item.comment + '"</p>';
								}
								var listpaiming = '<li class="mui-table-view-cell mui-media"><a onclick=toUomDetail("' + item.mid + '","' + item.symbol + '")>' +
									'<img class="mui-media-object mui-pull-left imgsma-coin" src="http://placehold.it/40x30">' +
									'<div class="mui-media-body"><dl class="flexbox"><dd>' +
									'<span class="black-small">' + item.symbol + '/' + item.name + '</span>' +
									'<span class="grey-light">￥' + mkvalstr + '亿</span>' +
									'</dd><dd><span class="black-small">￥' + item.priceCny.toFixed(4) + '</span>' +
									'<span class="grey-light">$' + item.price.toFixed(4) + '</span>' +
									'</dd><dd class="' + cls + '">' + valStr + '%</dd></dl></div></a>' +
									commStr + '</li>';
								$("#listpaiming").append(listpaiming);
							}
							$('.title2').html(hostinfor);

						}
					},
					error: function(xhr, type, errorThrown) {
						//异常处理；
						console.log(type);
					}
				});
			}
			//币种详情
			function toUomDetail(mid, uom) {
				var hid = $("#hid").val();
				if(mid != null && mid != "" && hid != null && hid != "") {
					mui.openWindow({
						url: 'coindetail3.html',
						id: 'coindetail3',
						extras: {
							mid: mid,
							symbol: uom,
							hid: hid
						}
					});
				} else {
					mui.toast('查看币种异常', {
						duration: '2000ms',
						type: 'div'
					})
				}
			}

			//添加收藏
			function addCol(obj) {
				var hid = $("#hid").val();
				if(uid == null || uid == "") {
					mui.openWindow({
						url: 'reg.html',
						id: 'reg'
					});
				} else {
					mui.ajax(userurl + '/api/iuser/info/addcol', {
						data: {
							hid: hid,
							uid: uid
						},
						dataType: 'json',
						type: 'post',
						success: function(data) {
							if(data.code == 1) {
								$(obj).html("已关注");
							} else {
								$(obj).html("已关注");
								mui.toast('已添加关注', {
									duration: '2000ms',
									type: 'div'
								})
							}
						},
						error: function(xhr, type, errorThrown) {
							console.log(type);
						}
					});
				}
			}
		</script>
	</body>

</html>